<template>
  <vp-dialog :span="4" ref="editDialogRef" class="drawer">
    <template #title >
      <vp-label :zh="`新增${formData.lx===10?'自愿报告':'举报信息'}-${formData.jb===10?'部门':'公司'}`" :en="`Add ${formData.lx===10?'Voluntary Report':'Reporting Information'}-${formData.jb===10?'Department':'Company'}`" v-if="type === 'add'"/>
      <vp-label :zh="`修改${formData.lx===10?'自愿报告':'举报信息'}-${formData.jb===10?'部门':'公司'}`" :en="`Edit ${formData.lx===10?'Voluntary Report':'Reporting Information'}-${formData.jb===10?'Department':'Company'}`" v-else/>
    </template >
      <VoluntaryDept
        :id="formData.id"
        :lx="formData.lx"
        :jb="formData.jb"
        :type="type"
        ref="editContingencyNoticeRef"
      ></VoluntaryDept>
    <template #footer>
       <vp-btn-save :loading="saveLoading" @click="handleSave(10)"/>
       <vp-btn-submit :loading="saveLoading" @click="handleSave(88)"/>
    </template>
  </vp-dialog>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive, ref, toRefs } from "vue";
import { useI18n } from "vue-i18n";
import VoluntaryDept from "./VoluntaryDept.vue";
import request from "/@/utils/request";

export default defineComponent({
  name: "editVoluntaryDept",
  components: {
    VoluntaryDept,
  },
  emits: ["formSubmited"],
  setup(props, context) {
    const state = reactive({
      type: "add",
      loading: false,
      saveLoading: false,
      termInputType: 1,
      formData: {
        id: "",
        lx: null,
        jb: null,
      },
    });

    const editDialogRef = ref();
    const formRef = ref();
    const editContingencyNoticeRef = ref();
    const { t } = useI18n();

    const handleOpen = (type: string, id: string, lx: number, jb: number) => {
      state.type = type;
      state.formData.id = id;
      state.formData.lx = lx;
      state.formData.jb = jb;
      editDialogRef.value.handleOpen();
    };

    const handleSave = (zt: number) => {
      if (state.loading) {
        return;
      }
       state.saveLoading = true;
        editContingencyNoticeRef.value.getData(zt).then((data: any)=>{
            request.post("/voluntary/dept/" + state.type, {
                ...data,
                nmbs : data.nmbs == 1 ? 1 : 0,
                bgryx: data.nmbs == 1 ? '' : data.bgryx,
                bgrdh: data.nmbs == 1 ? '' : data.bgrdh,
                zt: zt
            }).then(() => {
                context.emit("formSubmited");
                editDialogRef.value.handleClose();
            }).finally(()=>{
                state.saveLoading = false;
            })
        }).catch(()=>{state.saveLoading = false;});
    };

    onMounted(() => {});

    return {
      ...toRefs(state),
      editDialogRef,
      formRef,
      editContingencyNoticeRef,
      handleOpen,
      handleSave,
    };
  },
});
</script>

<style lang="scss" scoped>
.drawer {
  :deep(.el-checkbox__label) {
    min-width: 80px;
  }
}
</style>
